*{
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.selector{
    position: relative;
    background: rgba(9,29,69,0.8);;
    color: #BCD8FF;
    z-index: 99;
    border-right: 1px solid #39455B;
    display: -moz-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -moz-flex-direction:column;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
}
.selector-title{
    
    display: block;
    height: 55px;
    padding: 24px 0 10px 29px;
    color: #ffa320;
    font-size: 19px;
    font-weight: 500;
}
.selector-content{
    -moz-flex:1;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    overflow: hidden;
    display: -moz-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -moz-flex-direction:column;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
}
.selector-content-turb{
    -moz-flex:1;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    display: -moz-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -moz-flex-direction:column;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
}
.content-turb-main,.content-phase-main{
    -moz-flex:1;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    overflow-y: auto;
}
.content-turb-title,.content-phase-title{
    cursor: pointer;
    height: 35px;
    padding: 0 10px;
    color: #5ae0d6;
    font-size: 16px;
    background: #173268 url()no-repeat 97% center;
    z-index: 999;
}
.content-turb-title:hover,.content-phase-title:hover{
    background: rgba(23,50,104,0.6) url()no-repeat 97% center;
}
.content-turb-title>span,.content-phase-title>span{
    display: block;
    height: 100%;
    line-height: 35px;
}
.content-turb-title>span{
    background: url()no-repeat left center;
    padding-left: 20px;
}
.content-phase-title>span{
    background: url()no-repeat left center;
    padding-left: 20px;
}
.content-turb-title:hover::after,.content-phase-title:hover::after{
    content: "";
    width: 0px;
    height: 0px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent  transparent  transparent #183159;
    position: absolute;
    right: -20px;
    -webkit-transform: translateY(-130%);
            transform: translateY(-130%);
    z-index: 2;
}
.app-turbine-selector {
    z-index: 1;
    position: relative;
}
.turbine-selector{
    position: absolute;
    left: 100%;
    top: 0;
    min-width: 800px;
    height: 100%;
    background: rgba(9,29,69,0.95);
    padding: 15px;
    display: none;
    z-index: 999;
}
.farm{
    padding: 10px 0 0 15px;
}
.farmName{
    font-size: 14px ;
    color: #93cdff;
}
.selector-turbines,.selector-tag{
    display: -webkit-flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    
}
.selector-turbines span,.selector-tag span{
    
    display: inline-block;
    height: 24px;
    line-height: 20px;
    padding: 2px 0;
    border-bottom: 1px solid #1D2D4D;
}
.selector-turbines span{
   width:25%;
}
.selector-tag span{
    width: 50%;
}
.selector-turbines span>i,.selector-tag span>i{

    display: inline-block;
    width: 100%;
    height: 20px;
    font-size: 10px ;
    font-size-adjust: 0.9;
    color: #c9d3e6;
    font-style: normal;
    text-align: left;
    border-radius: 10px;
    position: relative;
    padding: 0 7px;
    text-overflow:ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.selector-turbines span>i:hover,.selector-tag span>i:hover{
    background:  #1D2D4D;
}
.selector-turbines span>i>b,.selector-tag span>i>b{
    position: absolute;
    width: 6px;
    height: 100%;
    right: 5px;
    top: 0;
    background: url()no-repeat center center;
    cursor: pointer;
    display: none;
}
.active{
    display: block;
}
.selector-turbines span>i:hover>b,.selector-tag span>i:hover>b{
    display: block;
}
::-webkit-scrollbar  
{  
    width: 8px; 
    height: 8px;
 
}
/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track  
{  
    background-color:#4E84A8; 
    border-radius:2em; 
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb  
{  
    background-color:#0F2741; 
    border-radius:2em;
}  

